{% load i18n static %}
<style type="text/css">
        .case {
            position: absolute;
            width: 65%;
            /*height: ;*/
            margin-left: 9%;
            overflow: hidden;
            /*left: calc(50% - 400px);*/
            top: 22%;

        }
        .case > .part1 {
            float: left;
            /*width: 5%;*/
            /*height: 30px;*/
        }
        .case > .part1 > img {
            width: 20px;
            height: 20px;
            float: right;
            margin-top: 5px;
        }
        /*.case > .part2 {*/
            /*float: left;*/
            /*width: 80%;*/
            /*height: 30px;*/
            /*text-indent: 1em;*/
            /*overflow: hidden;*/
        /*}*/
        /*#part2 > ul {*/
            /*width: 100%;*/
            /*height: auto;*/
            /*list-style: none;*/
            /*padding: 0;*/
            /*margin: 0;*/
        /*}*/
        .case .qq {
            float: left;
        }
        .ck li {
            float: left;
        }
        #wrap *{
                margin: 0;
                padding: 0;
                font-size: 16px;
                text-decoration: none;
            }

        #wrap{
            width: 70%;
            /*margin: 20px auto;*/
            /*border: 2px solid green;*/
            white-space: nowrap;
            overflow: hidden;
            margin-left: 3%;
            color: white;
            /*background: #33AAAA;*/
        }

        #wrap a {
            display: inline-block;
            font-size: 20px;

        }
</style>
<header class="main-header">
    <!-- Logo -->
    <a  class="logo">
        <!-- mini logo for sidebar mini 50x50 pixels -->
        {#      <span class="logo-mini"><b>S</b>tar</span>#}
        <span class="logo-mini"><img src="{% static 'img/starlogo_little.png' %}" alt=""></span>
        <!-- logo for regular state and mobile devices -->
        {#      <span class="logo-lg"><b>智慧星光</b> 采集后台</span>#}
        <span class="logo-lg"><img src="{% static 'img/starlogo_big.png' %}" alt=""> <!--<span>采集后台</span>--></span>

    </a>
    <!-- Header Navbar: style can be found in header.less -->
        <nav class="navbar navbar-static-top">
            <ul class="nav navbar-nav" id="ck">
                <!-- Sidebar toggle button-->
                <li>
                    <a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
                        <span class="sr-only"></span>
                    </a>
                </li>
            </ul>
            <!--</div>-->
            <div class="case">

                <div class="part1">
                    <i class="fa fa-fw fa-volume-up" style="color: white"></i>
                </div>
                <!--<div class="part2" id="part2">-->
                    <!--<div id="scroll1">-->
                        <!--<ul>-->
                            <!--{% for notice in all_notice %}-->
                                <!--{% if notice.position == 0 %}-->
                                    <!--<li style="margin: 28px 0 !important;"><a style="color: white;" href="">{{ notice.content }}</a></li>-->
                                <!--{% endif %}-->
                            <!--{% endfor %}-->
                        <!--</ul> </div>-->
                    <!--<div id="scroll2">-->
                    <!--</div>-->
                <!--</div>-->


                <div id="wrap">
                    <a href="#" style="color: white !important;">
                        <div id="first">
                        {% for notice in top_notice %}
                            {% if notice.position == 0 %}
                                {{ forloop.counter }}.{{ notice.content }}
                            {% endif %}
                        {% endfor %}
                        </div>
                    </a>

                    <a href="#" style="color: white !important;">
                        <div id="last">
                         {% for notice in top_notice %}
                            {% if notice.position == 0 %}
                                {{ forloop.counter }}.{{ notice.content }}
                            {% endif %}
                         {% endfor %}
                        </div>
                    </a>
                </div>

            </div>

            <div class="navbar-custom-menu">
                <ul class="nav navbar-nav">
                    <!-- Messages: style can be found in dropdown.less-->
                    <li class="dropdown messages-menu">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                            <b>新手攻略</b>
                            <i class="fa fa-envelope-o"></i>
                        </a>
                        <ul class="dropdown-menu" style="width: auto; min-width: auto;">
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="#">新手教程</a></li>
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="">教学文档</a></li>
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="">教学视频</a></li>
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="">爬虫模板</a>
                            </li>
                        </ul>
                    </li>

                    <li class="">
                        <a>
                            <b>我的任务</b>
                            <span class="label label-danger" id="unfinish_count">{{ unfinish_count }}</span>
                        </a>
                    </li>

{#                    <li>#}
{#                        <a href="{% url 'task:my_income' %}">#}
{#                            <b>我的收入：<span id="income">{{ my_income }}</span></b>#}
{#                        </a>#}
{#                    </li>#}
                    <!-- User Account: style can be found in dropdown.less -->
                    {% if request.user.is_active %}
                        <li class="dropdown user user-menu">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                <!--<img style="position: absolute;top: 35px;left: 20px;" src="{% static 'public/img/user_level/level_0.svg' %}">-->
                                <img src='{% static "dist/img/user2-160x160.jpg" %}' class="user-image" alt="User Image">

                                <span class="hidden-xs">{{ request.user.username }}</span>
                            </a>
                            <ul class="dropdown-menu">
                                <!-- User image -->
                                <li class="user-header">
                                    <img src='{% static "dist/img/user2-160x160.jpg" %}' class="img-circle" alt="User Image">
                                    <p>
                                        {{ request.user.username }}

                                    </p>
                                </li>
                                <!-- Menu Body -->

                                <!-- /.row -->
                                </li>
                                <!-- Menu Footer-->
<!--                                <li class="user-footer">-->
<!--                                    <div class="pull-left">-->
<!--                                        <a href="{% url 'zhongbao_admin:settings' %}"-->
<!--                                           class="btn btn-default btn-flat">帐号设置</a>-->
<!--                                    </div>-->
<!--                                    <div class="pull-right">-->
<!--                                        <a href="{% url 'zhongbao_admin:logout' %}" class="btn btn-default btn-flat">退出</a>-->
<!--                                    </div>-->
<!--                                </li>-->
                            </ul>
                        </li>
                    {% endif %}
                    <!--
                    {/% if request.user.is_superuser %}
                        <li class="dropdown user user-menu">
                            <a href="{/% url 'zhongbao_admin:reload_uwsgi' %}" class="dropdown-toggle"><span
                                    class="hidden-xs">重启uwsgi</span></a>
                        </li>
                    {/% endif %}
                    -->
                    <!-- Control Sidebar Toggle Button -->
                    <li style="display: none">
                        <a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
                    </li>
                </ul>
            </div>
            {% csrf_token %}
        </nav>

    <script type="text/javascript">

        (function () {
        var wrap = document.getElementById('wrap'), first = document.getElementById('first');
        var timer = window.setInterval(move, 10);
        wrap.onmouseover = function () {
            window.clearInterval(timer);
        };
        wrap.onmouseout = function () {
            timer = window.setInterval(move, 10);
        };
        function move() {
            wrap.scrollLeft++;
            if (wrap.scrollLeft >= first.scrollWidth) {
                wrap.scrollLeft = 0;
            }
        }
    })();

    </script>
</header>